<div class="row-fluid">
	<div class="span12">
		<ul class="breadcrumb">
			<li>
				<a href="index.php">
					<i class="radmin-icon radmin-home"></i>
					Dashboard
				</a>
				<span class="divider">/</span>
			</li>
			<li>
				<a href="user-list.php">
					<i class="radmin-icon radmin-user"></i>
					Users
				</a>
				<span class="divider">/</span>
			</li>
			<li class="active">
				<img style="width: 8%; height: 8%" src="<?php echo baseUrl(); ?>/public/img/com.authy.authy_icon.png">
				2-Factor Authentication
			</li>
		</ul>
	</div>
</div>

<div class="row-fluid">
	<div class="span12">
		<h4 class="title"><?php $this->widget('application.components.mywidgets.WikiHelp', array('wiki' => 'authy_2factor')); ?> Authy 2-Factor Authentication Setup</h4>
		<div class="squiggly-border"></div>
		<form>
			<?php echo CHtml::dropDownList('id_users', $id_users[0], $usersDatasource, array('empty' => $countUsers . ' User To Setup')); ?><br />
			
			<?php echo CHtml::textField('user_email', '', array('class' => 'input uneditable-input user_info', 'disabled' => true)) ?><br />
			
			<input id="authy-countries", name="countryCode" placeholder="Country"></select>	<br />
			
			<input type="text" id="authy-cellphone" name="Cellphone" value="" placeholder="Cellphone" /><br />
			
			<button class="btn btn-small btn-primary" id="authy_btn" type="button">Submit</button><br /><br />
			<div class="row-fluid">
				<div class="span12 hide" id="authy_info">
					<div class="alert alter-block alert-info">
			<!--			<button type="button" class="close" data-dismiss="alert">&times;</button>-->
						<div class="content"></div>
					</div>
				</div>
			</div>
		</form>
	</div>
	
	<script>
		function getUserInfo(id_user)
		{
			$('.user_info').val('Loading...');
			$.ajax({
				type: 'get',
				url: <?php echo json_encode(url('user/getinfo')); ?>,
				data: {
					id_user: id_user
				},
				success: function(ret){
					$('#user_email').val(ret.email);
				},
				dataType: 'json'
			});
		}
	
		$('#id_users').change(function(){
			var id_user = $(this).val();
			if(id_user == ''){
				$('.user_info').val('');
			}else{
				getUserInfo(id_user);
			}
		}).change();

		var authyRequest = function(){
			this.requestUrl = '';
			this.id_users = null;
			this.countryCode = null;
			this.Cellphone = null;

			this.beforeRequest = function(id_user, doTimes){};
			this.requestCallback = function(id_user, serverReturn, doTimes){};
			this.afterDone = function(){};

			this.doTimes = 0;
			this.do = function(){
				this.doTimes++;
				var id_user = this.id_users.pop();
				if(!id_user){
					this.afterDone();
					return false;
				}
				this.beforeRequest(id_user, this.doTimes);
				var thisObj = this;
				$.ajax({
					type: 'post',
					url: thisObj.requestUrl,
					data: {
						id_user: id_user,
						countryCode: thisObj.countryCode,
						Cellphone: thisObj.Cellphone
					},
					success: function(ret){
						thisObj.requestCallback(id_user, ret, thisObj.doTimes);
						thisObj.do();
						return true;
					},
					dataType: 'json'
				});
			};
		};

		$('#authy_btn').click(function(){
			var countryCode = $('[name="countryCode"]').val();
			var Cellphone = $('#authy-cellphone').val();
			var id_users = [];
			if($('#id_users').val() == ''){
				$('#id_users option[value!=""]').each(function(k, v){
					id_users.push($(v).val());
				});
			}else{
				id_users.push($('#id_users').val());
			}

			$('#authy_info').blink({
				'beforeCall': function(){
					$('#authy_info .content').append(
						'<p><b>Status ('+id_users.length+' Users)</b></p>'
					);
				},
				'callBack': function(){
					var authyRequester = new authyRequest();
					var length = id_users.length;
					authyRequester.countryCode = countryCode;
					authyRequester.Cellphone = Cellphone;
					authyRequester.id_users = id_users;

					authyRequester.requestUrl = <?php echo json_encode(url('user/authy')); ?>;
					authyRequester.beforeRequest = function(id_user, doTimes){
						$('#authy_btn').button('Processing...');
						$('#authy_info .content').append(
							'<p>'+$('#id_users option[value="'+id_user+'"]').text()+': Waiting...'+' ('+doTimes+' of '+length+' Users)</p>'
						);
					};
					authyRequester.afterDone = function(){
						$('#authy_btn').button('reset');
					}
					authyRequester.requestCallback = function(id_user, serverReturn, doTimes){
						if(serverReturn.result){
							var fullname = $('#id_users option[value="'+id_user+'"]').text();
							var result = '<p class="text-success accordion-toggle" data-toggle="collapse">&nbsp;&nbsp;&nbsp;&nbsp; <b>'+fullname+' - Success</b></p>';
							$('#authy_info .content').append(result);
						}else{
							$.each(serverReturn.errors, function(attrName, error){
								$(error).each(function(k, e){
									$('#authy_info .content').append(
										'<p class="text-error">&nbsp;&nbsp;&nbsp;&nbsp; <b>'+$('#id_users option[value="'+id_user+'"]').text()+' - '+e+' ('+doTimes+' of '+length+' Users)</b></p>'
									);
								});
							});
						}
					};
					authyRequester.do();
				},
				'showTime': 0
			});
			
		});
	</script>
</div>